<template>
<div class="manage_frame">
    <Split v-model="split1" :min="0.001">
    <div slot="left" style="overflow-x:hidden;height:100%">
    <el-menu @select="menuSelect">
    <el-menu-item index="0">
    <i class="el-icon-user"></i>
    <span slot="title">用户管理</span>
    </el-menu-item>
    <el-menu-item index="1">
    <i class="el-icon-coin"></i>
    <span slot="title">缓存管理</span>
    </el-menu-item>
    <el-menu-item index="2">
    <i class="el-icon-set-up"></i>
     <span slot="title">接口管理</span></el-menu-item>
     <el-menu-item index="3">
    <i class="el-icon-time"></i>
    <span slot="title">日志管理</span>
    </el-menu-item>
    <el-menu-item index="4">
    <i class="el-icon-refrigerator"></i>
    <span slot="title">数据库管理</span>
    </el-menu-item>
    <el-submenu index="5">
    <template slot="title"><i class="el-icon-s-data"></i>
    <span>数据统计</span></template>
    <el-menu-item index="5-1">
        <i class="el-icon-s-grid"></i>
        <span slot="title">仪表盘</span>
    </el-menu-item>
    </el-submenu>
    <el-menu-item index="6">
    <i class="el-icon-wallet"></i>
    <span slot="title">充值管理</span>
    </el-menu-item>
    <el-menu-item index="7">
    <i class="el-icon-office-building"></i>
    <span slot="title">资源管理</span>
    </el-menu-item>
</el-menu>

    </div>
    <div slot="right" style="height:100%">
        <keep-alive>
            <router-view>
            <!-- 页面展示区 -->
        </router-view>
        </keep-alive>
     
    </div>
</Split>

</div>
</template>

<script>
import { Split } from 'view-design';

export default{
    name: "Manage",
    props: {
        process: {
            type: Object,
            required: true
        }
    },
    data(){
        return {
            split1:0.2
        }
    },
    mounted(){
        this.__init()
    },
    methods:  {
        __defend() {
            // 管理员应用 提前校验权限
        },
        __init() {
            
            this.$pubsub.subscribe(`${this.process.process_id}:panelToLeft`,this.panelToLeft)
            this.$pubsub.subscribe(`${this.process.process_id}:panelToRight`,this.panelToRight)
        },
        menuSelect(index){
            const process = this.process
            switch(index){
                case '0':
                this.$router.push({
                    name:'usermanage'
                })
                    break;
                case '2':
                this.$router.push({
                    name:'swagger'
                })
                break;
                case '5-1':
                this.$router.push({
                    name:'dataManage'
                })
                break;
                case '4':
                this.$router.push({
                    name:'dataBaseManage'
                })
                break;
                case '3':
                this.$router.push({
                    name:'logsManage',
                    params:{
                        process
                    }
                })
                break;
            }
        },
        panelToRight(name){
            this.split1 = 0.2
        },
        panelToLeft(name){
            this.split1 = 0.001
        }
    },
    components: { Split }
}
</script>
<style scoped>
.manage_frame{
    width:100%;
    height:100%
}
</style>